<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>示例</title>
</head>
<body>
    <!-- 指令（Directives） 是Vue.js 模板中最常用的功能，使用前缀 v- ，比如 v-if、v-html、v-pre 等 -->

    <!-- v-if -->
        <!-- 判断条件，为真则插入 p 标签，为假则移除 -->
    <div id="app">
        <p v-if="show">显示这段文本</p>
    </div>

    <script src="https://unpkg.com/vue/dist/vue.min.js"></script>
    <script>

        var app = new Vue({
            el: "#app",
            data: {
                show: true      // 当 show 的值为 true 时，p 元素会被插入到 html 文档中，否则被移除
            }
        });

    </script>

</body>
</html>